<html
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">

    <ui:composition template="layout.xhtml">
        
        <ui:define name="title">
            Entrada de Selo
        </ui:define>

        <ui:define name="breadcrumb">
            <div class="breadcrumb_divider"></div>
            <a href="pesquisarEntradaSelo.xhtml">Entrada de Selo</a>
            <div class="breadcrumb_divider"></div>
            <a class="current">#{ managerCriarEntradaSelo.entradaSelo.id == null ? 'Cadastrar' : 'Editar' }</a>
        </ui:define>

        <ui:define name="sidebar">
            <h3>Entrada de Selo</h3>
            <ul class="toggle">
                <li class="icn_new_article"><a href="criarEntradaSelo.xhtml">Cadastrar</a></li>
                <li class="icn_search"><a href="pesquisarEntradaSelo.xhtml">Pesquisar</a></li>
            </ul>
            <h3>Ações</h3>
            <ul class="toggle">
                <li class="icn_categories"><a href="criarEntradaSelo.xhtml?entradaSeloId=#{ managerPesquisarEntradaSelo.entradaSeloVisualizar.id }">Editar</a></li>
            </ul>
        </ui:define>

        <ui:define name="content">

            <p:panel id="visualizarEntradaSeloPanel" styleClass="column12">

                <div class="row">
                    <div class="column2 bold">
                        <p:outputLabel value="Número da Nota:" />
                    </div>
                    <div class="column3 text">
                        <p:outputLabel value="#{ managerPesquisarEntradaSelo.entradaSeloVisualizar.numeroDaNota }" />
                    </div>

                    <div class="column2 bold">
                        <p:outputLabel value="Data da Nota:" />
                    </div>
                    <div class="column3 text">
                        <p:outputLabel value="#{ managerPesquisarEntradaSelo.entradaSeloVisualizar.dataDaNota }">
                            <f:convertDateTime pattern="dd/MM/yyyy"/>
                        </p:outputLabel>
                    </div>
                </div>

                <div class="row">
                    <div class="column2 bold">
                        <p:outputLabel value="Fornecedor:" />
                    </div>
                    <div class="column8 text">
                        <p:outputLabel value="#{ managerPesquisarEntradaSelo.entradaSeloVisualizar.fornecedor.nome }" />
                    </div>
                </div>

                <div class="row">
                    <div class="column2 bold">
                        <p:outputLabel value="Observação:" />
                    </div>
                    <div class="column8 text">
                        <p:outputLabel value="#{ managerPesquisarEntradaSelo.entradaSeloVisualizar.observacao }" />
                    </div>
                </div>

                <p:dataTable id="detalheEntradaSeloDataTable" var="detalhe" value="#{ managerPesquisarEntradaSelo.detalhesEntradaSeloVisualizar }"
                        styleClass="grid_24" emptyMessage="Nenhum detalhe adicionado">
                    <f:facet name="header">Detalhe da Entrada de Selos</f:facet>

                    <p:column headerText="Cor" width="5%">
                        <div class="color" style="background: \##{ detalhe.tipoSelo.corSelo }"></div>
                    </p:column>
                    <p:column headerText="Tipo de Selo" width="20%">
                        #{ detalhe.tipoSelo.nome }
                    </p:column>
                    <p:column headerText="Série" width="15%">
                        #{ detalhe.serie }
                    </p:column>
                    <p:column headerText="Preço" width="15%">
                        <h:outputLabel value="#{ detalhe.preco }">
                            <f:convertNumber type="currency" locale="pt-BR" />
                        </h:outputLabel>
                    </p:column>
                    <p:column headerText="Número Inicial" width="15%">
                        #{ detalhe.numeroInicial }
                    </p:column>
                    <p:column headerText="Quantidade" width="10%">
                        #{ detalhe.quantidade }
                    </p:column>
                    <p:column headerText="Número final" width="15%">
                        #{ detalhe.numeroFinal }
                    </p:column>                            
                </p:dataTable>

            </p:panel>

            <div class="command">
                <p:button value="Voltar" icon="ui-icon-arrowreturn-1-w" href="pesquisarEntradaSelo.xhtml" />
            </div>            

        </ui:define>
    </ui:composition>

</html>
